import React, { Component } from "react";
import { Tabs, Accordion, Modal } from "antd-mobile";
import MainLayout from "@/component/mainLayout/mainLayout";
import "./index.scss";
import yhTools from "@tools/yh";

class AllQuestion extends Component {
	constructor(props) {
		super(props);
		this.state = {
			visibleModal: false
		};
	}
	handleCallPhone = () => {
		let callPhoneData = {
			telphone: "4006906663"
		};
		yhTools.callPhone(callPhoneData);
	};
	render() {
		const _pageParams = {
			header: {
				title: "常见问题",
				goToApp: false
			},
			history: this.props.history
		};
		const tabs = [
			{ title: "小辉付", sub: "1" },
			{ title: "小辉贷", sub: "2" },
			{ title: "小辉宝", sub: "3" }
		];
		return (
			<MainLayout pageParams={_pageParams}>
				<div className="all-question-page">
					<Tabs
						tabs={tabs}
						initialPage={0}
						onChange={(tab, index) => {
							console.log("onChange", index, tab);
						}}
						onTabClick={(tab, index) => {
							console.log("onTabClick", index, tab);
						}}
					>
						{/* 小辉付问题 */}
						{/* <Scroll isScroll={true}> */}
						<div>
							<Accordion className="custo-acc">
								<Accordion.Panel header="1.小辉付是什么？" className="pad">
									<p className="info-content">
										小辉付是面向永辉超市消费者的信用消费产品，用户在消费时可用使用小辉付的额度，享受“本月花，下月还”的购物体验。每月按账单金额还款，免息期最长35天。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="2.小辉付的使用范围？" className="pad">
									<p className="info-content">
										可以在永辉生活APP、线下永辉超市bravo/永辉mini店消费使用。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="3.小辉付额度？" className="pad">
									<p className="info-content">
										经过简单的实名认证，就可以得到一个初始额度，后续根据的您的使用情况不定期进行综合评估，多使用小辉付且还款情况良好，有助于提升您的小辉付额度。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="4.小辉付如何使用？" className="pad">
									<p className="info-content">
										①线上永辉生活APP：您在支付订单时，选择小辉付进行支付，还可参加支付随机立减活动哦，最高可减99元。
									</p>
									<p className="info-content">
										②线下永辉超市bravo/永辉mini店：您可打开永辉生活APP-小辉付，点击付款码，进行扫码完成支付。
									</p>
								</Accordion.Panel>
								<Accordion.Panel
									header="5.小辉付满减优惠券如何使用？"
									className="pad"
								>
									<p className="info-content">
										用户使用小辉付支付并满足优惠券条件，在支付时会默认使用优惠券。
									</p>
								</Accordion.Panel>
								<Accordion.Panel
									header="6.申请退款后，小辉付优惠券还能再使用吗？"
									className="pad"
								>
									<p className="info-content">
										用户享受随机立减优惠后发生退款的，随机立减优惠将按比例回收；永辉使用满减券后发生退的，全额退款支持退还满减券，部分退款不支持退还优惠券。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="7.小辉付如何还款？" className="pad">
									<p className="info-content">
										还款：每月账单日出账后，可以在出账日至还款日之间任何一天进行主动还款，或者在还款日当天进行自动还款（建议开通自动还款）。
									</p>
									<p className="info-content">
										账单日：获取授信额度当日的次月对应日期。（比如获得授信额度日期为5日，则账单日为每月5日；23-31日授信的用户，账单日统一为次月23日）。
									</p>
									<p className="info-content">
										还款日：账单日后5个自然日为还款日。还款日如未还款/最低还款，构成逾期。（如出账单日为5日，还款日为10日）。
									</p>
									<p className="info-content">
										①主动还款：账单生成后还款日之前可以在【永辉生活APP】-【小辉付】-【本期应还】里主动操作还款。
									</p>
									<p className="info-content">
										②系统代扣：除主动还款外，我们会在还款日当天上午、下午在您签约的还款卡中对账单全部金额进行自动代扣。
									</p>
									<p className="info-content">
										温馨提示：因扣款账号余额不足等原因造成的自动扣款失败，请及时主动操作还款。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="8.什么是自动还款？" className="pad">
									<p className="info-content">
										从还款日当天开始，服务商将对您设置自动还款的银行卡发起自动扣款。请在还款日前确保您用于还款的银行账户余额充足，并确保账户前述功能未受限且未超限额。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="9.账单日是否可更改？" className="pad">
									<p className="info-content">
										目前账单日确定不支持更改，后续我们会持续优化哦。
									</p>
								</Accordion.Panel>
								<Accordion.Panel
									header="10.小辉付支持未出账单提前还款吗？"
									className="pad"
								>
									<p className="info-content">
										出账单之后才可进行还款操作，未出账单的支持提前还款，敬请谅解。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="11.什么是最低还款？" className="pad">
									<p className="info-content">
										还款期内可以选择最低还款，但剩余未还款本金从到期还款日次日开始计算利息，具体利率以页面展示为准，并计入下期账单。最低还款不属于逾期。
									</p>
								</Accordion.Panel>
								<Accordion.Panel
									header="12.小辉付有还款通知吗？"
									className="pad"
								>
									<p className="info-content">
										永辉金融会在出账单日后，还款日前短信提示您，请您注意查收并按时主动还款，避免逾期。
									</p>
								</Accordion.Panel>
								<Accordion.Panel
									header="13.如何更换自动还款银行卡？"
									className="pad"
								>
									<p className="info-content">
										您在小辉付-银行卡添加新银行卡，即默认新绑定银行卡为自动还款银行卡。
									</p>
								</Accordion.Panel>
								<Accordion.Panel
									header="14.如何解绑自动还款银行卡？"
									className="pad"
								>
									<p className="info-content">
										您结清永辉金融全部信贷产品，即可进行银行卡一键解绑。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="15.小辉付如何注销？" className="pad">
									<p className="info-content">
										若需申请注销，请下载永辉金融APP，点击【我的】-设置-注销账户。
									</p>
								</Accordion.Panel>
							</Accordion>
							<div className="noproblem">
								<span className="no">没有找到合适的帮助信息？</span>
								<span
									className="customerService"
									onClick={() => {
										this.setState({ visibleModal: true });
									}}
								>
									联系客服
								</span>
							</div>
						</div>
						{/* </Scroll> */}
						{/* 小辉贷问题 */}
						<div>
							<Accordion className="custo-acc">
								<Accordion.Panel header="1.什么是小辉贷？" className="pad">
									<p className="info-content">
										小辉贷是一款用于个人消费的现金分期产品，旨在满足永辉消费者资金周转需求。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="2.申请条件" className="pad">
									<p className="info-content">
										1.年龄22周岁到56周岁之间（不含56周岁），具有完全民事行为能力的个人；
									</p>
									<p className="info-content">2.不为在校大学生；</p>
								</Accordion.Panel>
								<Accordion.Panel header="3.借款期限" className="pad">
									<p className="info-content">
										小辉贷借款期限一般有3、6、9、12期等，具体可选期数请以页面显示为准。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="4.借款额度" className="pad">
									<p className="info-content">
										小辉贷最高额度为20万元，根据每个账户使用情况不同，小辉贷额度也可能不一样。您可以点击【会员中心】-【小辉贷】-【申请开通】进行申请。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="5.还款方式" className="pad">
									<p className="info-content">
										1.主动还款，还款路径：【会员中心】-【小辉贷】-【去还款】。
									</p>
									<p className="info-content">
										2.自动还款：系统默认会在还款日从您的放款卡自动代扣，建议您在还款日当天上午10点前保持扣款资金充足。
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="6.提前结清" className="pad">
									<p className="info-content">
										放款30天之后支持提前结清，提前结清按日计息，无手续费。
									</p>
								</Accordion.Panel>
							</Accordion>
							<div className="noproblem">
								<span className="no">没有找到合适的帮助信息？</span>
								<span
									className="customerService"
									onClick={() => {
										this.setState({ visibleModal: true });
									}}
								>
									联系客服
								</span>
							</div>
						</div>
						{/* 小辉宝问题 */}
						<div>
							<Accordion className="custo-acc">
								<Accordion.Panel header="Q1.什么是小辉宝？" className="pad">
									<p className="info-content">
										答：小辉宝是永辉金融与合作银行推出的福利平台，用户在使用小辉宝的过程中可以免费获得“辉豆”，“辉豆”可用于永辉超市购物消费
									</p>
								</Accordion.Panel>

								<Accordion.Panel
									header="Q2.华通银行与永辉金融是什么关系？"
									className="pad"
								>
									<p className="info-content">
										小辉宝产品及相关金融服务由永辉金融合作华通银行提供，永辉金融作为信息展示平台，存款交易通过用户在华通银行开通的电子账户完成。
									</p>
								</Accordion.Panel>

								<Accordion.Panel
									header="Q3.小辉宝产品是否受银行存款保险保障？"
									className="pad"
								>
									<p className="info-content">
										小辉宝是标准的银行存款，完全按照国家监管要求执行存款保险条款。
									</p>
								</Accordion.Panel>

								<Accordion.Panel
									header="Q4.为什需要开通华通银行电子账户？"
									className="pad"
								>
									<p className="info-content">
										根据监管要求，银行接受用户存款，需先为用户开立账户；并且，通过电子账户与银行交易，资金安全有保障
									</p>
								</Accordion.Panel>
								<Accordion.Panel header="Q5.如何进行大额转账？" className="pad">
									<p className="info-content">
										由于绑定银行卡线上转账有限额，需要复制您的华通银行电子账户号，登录绑定银行卡开户行的网页或手机APP，通过转账功能转入金额；您也可以选择通过绑定银行卡的线下网点完成转账。
									</p>
									<p className="info-content">
										特别提醒：不能通过非绑定银行卡转入资金。
									</p>
								</Accordion.Panel>
								<Accordion.Panel
									header="Q6.小辉宝的福利如何计算？"
									className="pad"
								>
									<p className="info-content">
										小辉宝的福利根据用户每日24时账户达标余额计算，采取四舍五入计数规则进行奖励统计，并于次日发放到账。
									</p>
								</Accordion.Panel>
								<Accordion.Panel
									header="Q7.如何更换绑定银行卡？"
									className="pad"
								>
									<p className="info-content">
										请拨打华通银行客服电话：400-8219-666
									</p>
								</Accordion.Panel>
							</Accordion>
							<div className="noproblem">
								<span className="no">没有找到合适的帮助信息？</span>
								<span
									className="customerService"
									onClick={() => {
										this.setState({ visibleModal: true });
									}}
								>
									联系客服
								</span>
							</div>
						</div>
					</Tabs>
				</div>
				<Modal
					visible={this.state.visibleModal}
					transparent
					maskClosable={false}
					onClose={() => {
						this.setState({ visibleModal: false });
					}}
					footer={[
						{
							text: "确定",
							onPress: () => {
								this.setState({ visibleModal: false });
							}
						}
					]}
				>
					<p className="customer-service">
						请前往永辉金融公众号留言，或拨打客服热线
						<a href="javascript:;" onClick={this.handleCallPhone}>
							400-690-6663
						</a>
					</p>
				</Modal>
			</MainLayout>
		);
	}
}

export default AllQuestion;
